<template>
	<div class="task-list">
		<iframe
			src="https://view.officeapps.live.com/op/embed.aspx?src=http://47.110.86.147:8081/html/static/other/2020/10/14/20201014111539012_75381744.xlsx"
			width="1366px"
			height="623px"
			frameborder="0"
		>
			This is an embedded
			<a target="_blank" href="http://office.com">Microsoft Office</a>
			document, powered by
			<a target="_blank" href="http://office.com/webapps">Office Online</a>
		</iframe>
		<!-- <p v-if="err !== ''">{{ err }}</p>
    <table border="1" style="margin:0 auto;" v-if="content !== ''">
      <tr>
        <th v-for="h in content[0]" :key="h.id">{{ h }}</th>
      </tr>
      <tr v-for="row in content.slice(1)" :key="row.id">
        <td v-for="item in row" :key="item.id">{{ item }}</td>
      </tr>
    </table> -->
	</div>
</template>

<script>
	import axios from 'axios'
	import XLSX from 'xlsx'
	import transformSheets from '@/utils/read_xlsx.js' //导入转制函数
	export default {
		data() {
			return {
				content: '', //初始化数据
				err: 'aaa'
			}
		},
		created() {
			let url = '/task1.xlsx'
			axios
				.get(url, { responseType: 'arraybuffer' })
				.then(res => {
					let data = new Uint8Array(res.data)
					let sheets = XLSX.read(data, { type: 'array' }).Sheets
					console.log(sheets)
					this.content = transformSheets(sheets)
				})
				.catch(err => {
					this.err = err
				})
		}
	}
</script>

<style lang="scss" scoped>
	@import './index';
</style>
